<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>

  <style type="text/css">
    @import url(./header.css);
    @import url(./second-head.css);
    @import url(../bottom.css);
    @import url(./position.css);


    .middleDiv {
      height: 1000px;
      width: 100%;
      position: relative;

    }

    .yearDiv {
      position: absolute;
      width: 18%;
      height: 180px;
      /* background-color: aqua; */
    }

    .yearDiv .choiceYear {
      position: absolute;
      left: 55%;
      top: 50px;
      width: 100%;
      height: 42px;
      border: 1px solid grey;
    }

    .choiceYear span {
      float: left;
      font-size: 16px;
      line-height: 42px;
      margin-left: 12px;
    }

    .yearDiv .year {
      position: absolute;
      margin-left: 55%;
      top: 94px;
      list-style-type: none;
      line-height: 30px;
      border: 1px solid #ececec;
      border-top: none;
      width: 100%;
      /* visibility: collapse; */
    }

    .year {
      height: 0px;
      /* transform: scaleY(0); */
      overflow: hidden;
      transform-origin: top;
      transition: all 0.5s;
    }

    .year li {
      /* border: 1px solid black; */
      text-align: left;
      padding-left: 12px;
      color: blue;
      background-color: white;
    }

    /* .yearDiv:hover .year {
      visibility: visible;
    } */

    .passageDiv {
      position: absolute;
      width: 80%;
      height: auto;
      margin-left: 10%;
      margin-top: 180px;
      /* border: 1px solid grey; */
    }

    .passageDiv .item {
      position: absolute;
      width: 100%;
      height: 100px;
      border-top: 1px solid #E3E3E3;
      /* background-color: black; */
    }

    .passageDiv .item .time {
      position: absolute;
      text-align: center;
      width: 105px;
      height: 60px;
      top: 20px;
      border-right: 1px solid grey;
      /* background-color: black; */
    }

    .passageDiv .item .time span {
      font-size: 45px;
      line-height: 32px;
      color: blue;
    }

    i {
      width: 100%;
      display: block;
      font-size: 14px;
      line-height: 20px;
      color: #000;
      opacity: 0.8;
    }

    .passageDiv .item .item-title {
      position: absolute;
      left: 106px;
      height: 100%;
      width: 60%;
      line-height: 100px;
    }

    .passageDiv .item-title span {
      font-size: 20px;
      margin-left: 50px;
    }

    .pdfIcon {
      margin-top: 20px;
      margin-left: 90%;
      height: 60px;
    }
  </style>

</head>

<body>
  <div>
    <script src="./header.js"></script>
  </div>

  <div class="positionFont">
    <span><a href="#">首页</a> > <a href="./serveConcept.html">服务中心</a> > 产品企业标准</span>
  </div>

  <div>

    <img style="width: 100%;" src="../img/serveCenter/publicImg2.jpg" />

    <div class="second-head">
      <div class="second-head-div">
        <div>
          <a href="./serveConcept.html">服务理念</a>
          <div class="border-div"></div>
        </div>
        <div>
          <a href="./serveConsumer.html">服务消费者</a>
          <div class="border-div"></div>
        </div>
        <div>
          <a href="./serveParnter.html">服务合作伙伴</a>
          <div class="border-div"></div>
        </div>
        <div>
          <a href="./productC&A.html">产品Q&A</a>
          <div class="border-div"></div>
        </div>
        <div>
          <a href="#" style="color: blue;">产品企业标准</a>
          <div class="border-div" style="width: 100%;"></div>
        </div>
        <div>
          <a href="./want-EattingSafe.htm">旺话食安</a>
          <div class="border-div"></div>
        </div>
        <div>
          <a href="#">廉洁旺旺</a>
          <div class="border-div"></div>
        </div>
      </div>
    </div>

    <div class="middleDiv">

      <div class="yearDiv">
        <div class="choiceYear" id="choice">
          <span>选择年份</span>
        </div>
        <ul class="year" id="year">
          <li>2021</li>
          <li>2020</li>
        </ul>
        <p style="margin-top: 110px;margin-left: 55%;;">共找到7篇文章</p>
      </div>

      <div class="passageDiv">

        <div class="item">
          <div class="time">
            <span>21</span>
            <i>2021.05</i>
          </div>
          <div class="item-title">
            <span> 哈尔滨旺旺食品有限公司固废公开情况说明</span>
          </div>
          <img class="pdfIcon" src="../img/serveCenter/ProductEnterpriseStandard/pdf.png">
        </div>

        <br><br><br><br><br>
        <div class="item">
          <div class="time">
            <span>31</span>
            <i>2020.12</i>
          </div>
          <div class="item-title">
            <span>广州旺旺食品有限公司开展AWS项目的进展和成绩</span>
          </div>
          <img class="pdfIcon" src="../img/serveCenter/ProductEnterpriseStandard/pdf.png">
        </div>

        <br><br><br><br><br>
        <div class="item">
          <div class="time">
            <span>31</span>
            <i>2020.12</i>
          </div>
          <div class="item-title">
            <span> 广州旺旺食品有限公司AWS水管理信息公开被披露报告-2</span>
          </div>
          <img class="pdfIcon" src="../img/serveCenter/ProductEnterpriseStandard/pdf.png">
        </div>

        <br><br><br><br><br>
        <div class="item">
          <div class="time">
            <span>31</span>
            <i>2020.12</i>
          </div>
          <div class="item-title">
            <span> 广州旺旺食品有限公司AWS水管理信息公开被披露报告-1</span>
          </div>
          <img class="pdfIcon" src="../img/serveCenter/ProductEnterpriseStandard/pdf.png">
        </div>

        <br><br><br><br><br>
        <div class="item">
          <div class="time">
            <span>04</span>
            <i>2020.12</i>
          </div>
          <div class="item-title">
            <span>关于广州大旺食品有限公司申请AWS认证的公示</span>
          </div>
          <img class="pdfIcon" src="../img/serveCenter/ProductEnterpriseStandard/pdf.png">
        </div>

        <br><br><br><br><br>
        <div class="item">
          <div class="time">
            <span>04</span>
            <i>2020.12</i>
          </div>
          <div class="item-title">
            <span>关于广州永旺食品有限公司申请AWS认证的公示</span>
          </div>
          <img class="pdfIcon" src="../img/serveCenter/ProductEnterpriseStandard/pdf.png">
        </div>

        <br><br><br><br><br>
        <div class="item">
          <div class="time">
            <span>18</span>
            <i>2020.03</i>
          </div>
          <div class="item-title">
            <span>Q/HDS 0002S-2019</span>
          </div>
          <img class="pdfIcon" src="../img/serveCenter/ProductEnterpriseStandard/pdf.png">
        </div>

        <br><br><br><br><br>
        <div class="item"></div>
      </div>
    </div>

    <script src="../bottom.js"></script>
  </div>
  <script type="text/javascript">
    var choiceYear = document.getElementsByClassName(" yearDiv")[0];
    var year = document.getElementById("year");
    var t = true;
    choiceYear.onclick = function () {
      // year.style.visibility = "visible";
      if (t == true) {
        year.style.height = 62 + "px";
        console.log('12')
        t = false;
      } else {
        console.log('1')
        year.style.height = 0 + "px";
        t = true;
      }
    }
  </script>
</body>


</html>